<div>
  <centerHeader :title="header"></centerHeader>
  <div class="data">
    <div class="orderdetails_top">
      <div class="block" v-for="(item,index) in data1" :key="index">
        <el-date-picker
          v-model="value7"
          type="daterange"
          align="right"
          unlink-panels
          range-separator="至"
          start-placeholder="开始日期"
          end-placeholder="结束日期"
          :picker-options="pickerOptions2"
          @change="clear(value7)">
        </el-date-picker>
        <button class="anniu" @click="search(informationActiveName,value7)">查询</button>
        <span>支付金额￥{{item.sum_moeny}}，支付笔数:{{item.count_money}}</span>
        <button class="up-list">导出已支付订单</button>
      </div>
    </div>
    <div class="orderdetails_con">
      
      <div class="input">
        <input v-model="searchOrder" type="text" placeholder="商户单号、微信交易号" id="search">
        <el-button type="primary" icon="el-icon-search" @click="search1(searchOrder)">搜索</el-button>
      </div>
      
      
      <!--<div class="search_div">-->
      <!--<input v-model="searchOrder" type="text" placeholder="商户单号、微信交易号 " id="search">-->
      <!--<span class="search" @click="search1(searchOrder)">-->
      <!--<i class="el-icon-search"/>-->
      <!--</span>-->
      <!--</div>-->
      
      
      <div class="orderdetails_con">
        <div class="lists">
          <el-tabs v-model="informationActiveName" type="card" @tab-click="handleClick">
            
            <el-tab-pane label="全部" name="first">
              <div class="s-table">
                <table class="table" border="1">
                  <thead>
                  <th style=" width: 20%;">商户单号</th>
                  <th style=" width: 20%;">用户</th>
                  <th style=" width: 10%;">金额</th>
                  <th style=" width: 10%;">订单状态</th>
                  <th style=" width: 20%;">创建日期</th>
                  <th style=" width: 10%;">来源</th>
                  </thead>
                  <tbody class="tbody" v-for="(item,index) in data2" :key="index">
                  <tr>
                    <td class="td1">{{item.order}}</td>
                    <td class="td1">{{item.nickname}}</td>
                    <td class="td1">￥{{item.money}}</td>
                    <td class="td3" style=" text-align: center;"><span class="td1_btn" :class="[item.pay_status==1?'yizhifu':''||item.pay_status==0?'weizhifu':''||item.pay_status==2?'quxiaozhifu':'']">{{item.pay_status==1?'已支付':''}}{{item.pay_status==0?'待支付':''}}{{item.pay_status==2?'已关闭':''}}</span>
                    </td>
                    <td class="td1">
                      {{item.datetime}}
                    </td>
                    <td class="td1">
                      {{checkpay_source_type(item.pay_source_type)}}
                    </td>
                  </tr>
                  </tbody>
                </table>
              </div>
              <div class="getMore" v-if="showMore1" @click="getMore(a(value7),value7)">{{moreInfo}}</div>
              <div class="getMore" v-else>没有数据了</div>
            </el-tab-pane>
            <el-tab-pane label="待支付" name="second">
              <div class="s-table">
                <table class="table" border="1">
                  <thead>
                  <th style=" width: 20%;">商户单号</th>
                  <th style=" width: 20%;">用户</th>
                  <th style=" width: 10%;">金额</th>
                  <th style=" width: 10%;">订单状态</th>
                  <th style=" width: 20%;">创建日期</th>
                  <th style=" width: 10%;">来源</th>
                  </thead>
                  <tbody class="tbody" v-for="(item,index) in data2" :key="index" v-show="item.pay_status==0">
                  <tr>
                    <td class="td1">{{item.order}}</td>
                    <td class="td1">{{item.nickname}}</td>
                    <td class="td1">￥{{item.money}}</td>
                    <td class="td3" style=" text-align: center;"><span class="td1_btn" :class="[item.pay_status==1?'yizhifu':''||item.pay_status==0?'weizhifu':''||item.pay_status==2?'quxiaozhifu':'']">{{item.pay_status==1?'已支付':''}}{{item.pay_status==0?'待支付':''}}{{item.pay_status==2?'已关闭':''}}</span>
                    </td>
                    <td class="td1">
                      {{item.datetime}}
                    </td>
                    <td class="td1">
                      {{checkpay_source_type(item.pay_source_type)}}
                    </td>
                  </tr>
                  </tbody>
                </table>
              </div>
              <div class="getMore" v-if="showMore2" @click="getMore(b(value7),value7)">{{moreInfo}}</div>
              <div class="getMore" v-else>没有数据了</div>
            </el-tab-pane>
            <el-tab-pane label="已支付" name="third">
              <div class="s-table">
                <table class="table" border="1">
                  <thead>
                  <th style=" width: 20%;">商户单号</th>
                  <th style=" width: 20%;">用户</th>
                  <th style=" width: 10%;">金额</th>
                  <th style=" width: 10%;">订单状态</th>
                  <th style=" width: 20%;">创建日期</th>
                  <th style=" width: 10%;">来源</th>
                  </thead>
                  <tbody class="tbody" v-for="(item,index) in data2" :key="index" v-show="item.pay_status==1">
                  <tr>
                    <td class="td1">{{item.order}}</td>
                    <td class="td1">{{item.nickname}}</td>
                    <td class="td1">￥{{item.money}}</td>
                    <td class="td3" style=" text-align: center;"><span class="td1_btn" :class="[item.pay_status==1?'yizhifu':''||item.pay_status==0?'weizhifu':''||item.pay_status==2?'quxiaozhifu':'']">{{item.pay_status==1?'已支付':''}}{{item.pay_status==0?'待支付':''}}{{item.pay_status==2?'已关闭':''}}</span>
                    </td>
                    <td class="td1">{{item.datetime}}</td>
                    <td class="td1">
                      {{checkpay_source_type(item.pay_source_type)}}
                    </td>
                  </tr>
                  </tbody>
                </table>
              </div>
              <div class="getMore" v-if="showMore3" @click="getMore(c(value7),value7)">{{moreInfo}}</div>
              <div class="getMore" v-else>没有数据了</div>
            </el-tab-pane>
            <el-tab-pane label="已关闭" name="fourth">
              <div class="s-table">
                <table class="table" border="1">
                  <thead>
                  <th style=" width: 20%;">商户单号</th>
                  <th style=" width: 20%;">用户</th>
                  <th style=" width: 10%;">金额</th>
                  <th style=" width: 10%;">订单状态</th>
                  <th style=" width: 20%;">创建日期</th>
                  <th style=" width: 10%;">来源</th>
                  </thead>
                  <tbody class="tbody" v-for="(item,index) in data2" :key="index" v-show="item.pay_status==2">
                  <tr>
                    <td class="td1">{{item.order}}</td>
                    <td class="td1">{{item.nickname}}</td>
                    <td class="td1">￥{{item.money}}</td>
                    <td class="td3" style=" text-align: center;"><span class="td1_btn" :class="[item.pay_status==1?'yizhifu':''||item.pay_status==0?'weizhifu':''||item.pay_status==2?'quxiaozhifu':'']">{{item.pay_status==1?'已支付':''}}{{item.pay_status==0?'待支付':''}}{{item.pay_status==2?'已关闭':''}}</span>
                    </td>
                    <td class="td1">{{item.datetime}}</td>
                    <td class="td1">{{checkpay_source_type(item.pay_source_type)}}</td>
                  </tr>
                  </tbody>
                </table>
              </div>
              <div class="getMore" v-if="showMore4" @click="getMore(d(value7),value7)">加载更多</div>
              <div class="getMore" v-else>没有数据了</div>
            </el-tab-pane>
          </el-tabs>
        </div>
      </div>
    
    
    
    </div>
  </div>
</div>
